<script setup>
import MwTable from "./component/MwTableAlarm";
import SearchTable from "./component/SearchAlarm.vue";
import { notifyOpen } from "@/utils/publicFun";
import moment from 'moment';
import { globalStore } from "@/store/global";
const globalVue = globalStore();

import { CirclePlus, VideoPlay } from '@element-plus/icons-vue';
import { ref, reactive, getCurrentInstance, onMounted, watch, h } from "vue";

const instance = getCurrentInstance();
const _this = instance.appContext.config.globalProperties; //
const storage = _this.$utils.storage;

// 生命周期
onMounted(() => {
  getTableData();   // 获取表格数据
  getSelect();
});
// 更新左侧统计数据
watch(() => globalVue.alarmNumber, (val) => {
  onSearch();   // 获取表格数据
});

function getTableData() {
  // 查询告警
  let paramsAlarm = {
    ...pagination,
    ...searchForm,
    startTime: searchForm.date && searchForm.date[0],
    endTime: searchForm.date && searchForm.date[1],
    date: ''
  };
  searchForm['city'] && (paramsAlarm['city'] = searchForm['city'] + '');
  searchForm['hospitalIds'] && (paramsAlarm['hospitalIds'] = searchForm['hospitalIds'] + '');
  tablLoading.value = true;
  instance.proxy.$http.get('overview.getAlarmList', { params: paramsAlarm }).then(res => {
    let { content, totalElements } = res.data;
    tableData.value = content;
    pagination.total = totalElements;
    tablLoading.value = false;
  }).catch(err => tablLoading.value = false);
};

async function getSelect() {
  selectClassification.value = await globalVue.getSelect('classificationSelect');
  stateList.value = await globalVue.getAlarmSelect();
  instance.proxy.$http.get('archiveData.dictDetail', { params: { name: 'alarm_level' } }).then(res => {
    selectLevel.value = res.data;
  });
  instance.proxy.$http.get('archiveData.dictDetail', { params: { name: 'alarm_algorithm' } }).then(res => {
    selectAlarmName.value = res.data;
  });
  instance.proxy.$http.get('archiveData.dictDetail', { params: { name: 'alarm_status' } }).then(res => {
    selectHandle.value = res.data;
  });
  instance.proxy.$http.get('archiveData.getHospitalSelect').then(res => {
    selectHospital.value = res.data.map(i => {
      i['label'] = i.selectName;
      i['value'] = i.id;
      return i;
    });
  });
  instance.proxy.$http.get('global.getAlarmAmbulanceSelect').then(res => {
    selectVehicle.value = res.data.map(i => {
      i['label'] = i.selectName;
      i['value'] = i.id;
      return i;
    });
  });
  instance.proxy.$http.get('archiveData.getCitySelect').then(res => {
    selectCity.value = res.data.map(i => {
      i['label'] = i.selectName;
      i['value'] = i.id;
      return i;
    });
  });
};

// 下拉数据
const selectVehicle = ref([]);   // 救护车
const selectCity = ref([]);   // 城市
const selectHospital = ref([]);   // 
const selectHandle = ref([]);   // 
const selectAlarmName = ref([]);   // 
const selectLevel = ref([]);   // 
const stateList = ref([]);   // 
const selectClassification = ref([]);   // 


// 表格数据
const tableData = ref([]);
const tablLoading = ref(false);
const pagination = reactive({
  page: 1,
  size: 10,
  total: 100
});
const _time = new Date();
const searchForm = reactive({
  // date: [moment(_time).subtract(1, 'months').format("YYYY-MM-DD") + ' 00:00:00', moment(_time).format("YYYY-MM-DD") + ' 23:59:59'],
  date: [],
});
function onSearch() {
  getTableData();
};

function paginationChange(pagination) {
  onSearch();
};

function onDetail(row) {
  instance.proxy.$http.get('archiveData.getAlarmDetail', { params: { id: row.id } }).then(res => {
    let statusObj = stateList.value.find(j => !j.label.indexOf(res.data.alarmTypeName));
    let obj = { ...res.data, ...statusObj };
    notifyOpen(obj);
  });
};

function onHandle(row) {
  instance.proxy.$http.get('archiveData.getAlarmDetail', { params: { id: row.id } }).then(res => {
    let statusObj = stateList.value.find(j => !j.label.indexOf(res.data.alarmTypeName))
    let obj = { ...row, ...statusObj };
    notifyOpen(obj);
  });
};
</script>
<template>
  <div class="table_index">
    <SearchTable :searchForm="searchForm" :selectClassification="selectClassification" :selectHospital="selectHospital" :selectHandle="selectHandle" :selectAlarmName="selectAlarmName" :selectLevel="selectLevel" :selectVehicle="selectVehicle" :selectCity="selectCity" @onSearch="onSearch" />
    <div class="table_content">
      <mw-table v-loading="tablLoading" :data="tableData" :pagination="pagination" @paginationChange="paginationChange" @operate1="onDetail" @operate2="onHandle"></mw-table>
    </div>
  </div>
</template>